<template>
 <div class="sideNav">
   <el-row class="tac">
              <el-col :span="12">
                <el-menu
                  :default-active="this.defaultActive"
                  @select="changeSidebar"
                  class="el-menu-vertical-demo">
                  <el-menu-item index="homeContent">
                    <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-78e17ca8=""><path fill="currentColor" d="M576 128v288l96-96 96 96V128h128v768H320V128h256zm-448 0h128v768H128V128z"></path></svg>
                    <!-- <i class="el-icon-shopping-cart-2"></i> -->
                    <span slot="title">首页</span>
                  </el-menu-item>
                  <el-menu-item index="signContent">
                    <!-- <i class="el-icon-menu"></i> -->
                    <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-78e17ca8=""><path fill="currentColor" d="M288 128h608L736 384l160 256H288v320h-96V64h96v64z"></path></svg>
                    <span slot="title">签到</span>
                  </el-menu-item>
                  <el-menu-item index="readContent">
                    <!-- <i class="el-icon-document"></i> -->
                    <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-78e17ca8=""><path fill="currentColor" d="M192 128v768h640V128H192zm-32-64h704a32 32 0 0 1 32 32v832a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V96a32 32 0 0 1 32-32z"></path><path fill="currentColor" d="M672 128h64v768h-64zM96 192h128q32 0 32 32t-32 32H96q-32 0-32-32t32-32zm0 192h128q32 0 32 32t-32 32H96q-32 0-32-32t32-32zm0 192h128q32 0 32 32t-32 32H96q-32 0-32-32t32-32zm0 192h128q32 0 32 32t-32 32H96q-32 0-32-32t32-32z"></path></svg>
                    <span slot="title">阅读</span>
                  </el-menu-item>
                  <el-menu-item index="couponsContent">
                    <!-- <i class="el-icon-document"></i> -->
                    <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-78e17ca8=""><path fill="currentColor" d="M640 832H64V640a128 128 0 1 0 0-256V192h576v160h64V192h256v192a128 128 0 1 0 0 256v192H704V672h-64v160zm0-416v192h64V416h-64z"></path></svg>
                    <span slot="title">优惠券</span>
                  </el-menu-item>
                  <el-menu-item index="aboutContent">
                    <!-- <i class="el-icon-setting"></i> -->
                    <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8=""><path fill="currentColor" d="M512 64a448 448 0 1 1 0 896.064A448 448 0 0 1 512 64zm67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344zM590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.992 12.992 0 0 1-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296-44.096 0-108.992 44.736-148.48 101.504 0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 0 1 7.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04 67.84 0 107.904-43.648 147.456-100.416z"></path></svg>
                    <span slot="title">关于我们</span>
                  </el-menu-item>
                </el-menu>
              </el-col>
            </el-row>
 </div>
</template>

<script>
 export default {
  name: '' ,
 data () {
 return {
  defaultActive: 'homeContent'
  }
 },
 mounted() {
    this.sidebarItem = this.$route.name;
    // console.log(this.$route.name)
    // this.defaultActive = this.$route.name
  },
  created() {
    this.defaultActive = this.$route.name
  },
 methods:{
  changeSidebar(path) {
    this.$router.push(path);
  },
 }
}

</script>
<style scope lang="less">
  .el-menu-vertical-demo{
    width: 200px !important;
  }
  svg{
    margin-right: 15px;
    width:23px;
  }
  .el-menu-item.is-active{
//设置背景颜色
  background-color: #DCEEE6 !important;
//设置字体颜色
  color:#28627C !important;
}
</style>